<template>
<view class="page">
	<view class="title_h">{{data.title||''}}
		<view class="small">
			<view class="">来源：{{data.from||''}}</view>  
			<view class="">阅读：{{data.read_num||''}}</view>
			<view class="">{{data.createtime||''+' '}}发布</view>
		</view>
	</view>
	<view class="page1">
		<rich-text class="content" :nodes="data.content"></rich-text>
		<view class="fj_title" v-show="data.files&&data.files.length>0">相关附件</view>
		<view class="fj_item" v-show="data.files&&data.files.length>0" v-for="(item,index) in data.files" :key='index'>
			<view class="fj_name" @click="downFile(item.file_url)">{{item.file_name}}</view>
		</view>
	</view>
</view>
</template>

<script>
	import { localprojects,gz,ShareAdd,pl ,hbApi ,news1 as news ,CreateQrcode} from '../../utils/api.js'
	export default {
		data() {
			return {
				bottom_iphone:uni.getStorageSync('bottom')||false,
				data:{id:'',image:'',chain_names:''},
				id:'',
				plList:[],
				numList:[],
				isSc:false,
				page:1,
				isNewRenderDone:true,
				total:0,
				name:''
			}
		},
		onLoad(option){
			if(option.query){
				this.data = JSON.parse(option.query)
				return
			}
			this.id = option.id || option.scene || ''
			this.name = option.name 
			this.getDetail(this.id)
		},
		onShareTimeline() {
			return {
				title: this.data.title+' | 投资钟祥',
			}
		},
		onShareAppMessage() {
			return {
				title:this.data.title+' | 投资钟祥',
			}
		},
		onReachBottom() {
			// 加锁，避免在加载更多时用户频繁下拉导致的重复触发而渲染异常
			// if(!this.isNewRenderDone) return;   
			// this.isNewRenderDone = false
			// this.page+=1
			// this.getPlList()
		},
		onShow(){
			// let time = setInterval(()=>{
			// 	if(this.id){
			// 		this.page=1
			// 		this.getPlList()
			// 		clearInterval(time)
			// 	}
			// },100)
		},
		methods: {
			downFile(url){
				if(!url){
					uni.showToast({
						title:'附件数据缺失',
						icon:'none'
					})
					return
				}
				uni.getSystemInfo({
					success: (res) => {
						// if (res.system.includes('iOS')) {
						// 	uni.navigateTo({
						// 		url:`/pages/pdfYl/pdfYl?src=${url}`
						// 	})
						// } else {
							console.log(url)
							uni.showLoading({
								title:'下载中'
							})
							uni.downloadFile({
								url: url,
								success: (res) => {
									const path = res.tempFilePath;
									uni.openDocument({
										filePath: path,
										fileType: 'xlsx',
										success: (res) => {
											uni.hideLoading()
											// uni.navigateBack({
											// 	delta: 1
											// });
										},
										fail: (err) => {
											uni.hideLoading()
											uni.showToast({
												title: '打开文件失败',
												icon: 'none',
												duration: 2000
											});
										}
									});
								},
								fail: (err) => {
									console.log(err);
									uni.hideLoading()
									uni.showToast({
										title: '下载文件失败',
										icon: 'none',
										duration: 2000
									});
								}
							});
						// }
					}
				});
			},
			showL(){
				this.$refs.rm.show() 
			},
			open(){
				this.$refs.open.show()
			},
			pl(){
				this.$refs.pl.show()
			},
			getDetail(id){
				uni.showLoading({
					title:'正在加载'
				})
				news.GetNewsDetail({id}).then(res=>{
					this.data = res.data
					uni.hideLoading()
				})
			},
			showhaibao(){
				uni.showLoading({ mask:true,title:'海报制作中',mask:true})
				CreateQrcode({type:2,id:this.id}).then(res=>{
					uni.hideLoading()
					if(res.status==0){
						uni.showToast({
							title:'海报制作失败...'
						})
						return
					}
					this.$refs.haibao.show(res.data.qrcode)
				})
			},
			getPlList(){
				pl.getList({identification:this.id,type:9,page:this.page}).then(res=>{
					if(this.page == 1){
						this.plList = res.data.data
					}else{
						this.plList = this.plList.concat(res.data.data) 
					}
					this.total = res.data.total
					this.isNewRenderDone = true
				})
			},
			toPl(){
				if( JSON.parse(uni.getStorageSync('userinfo')).nickname ){
					uni.navigateTo({
						url:`/pages/pl/pl?data=` + JSON.stringify({identification:this.data.id,type:9,name:this.data.title})
					})
				}else{
					uni.showModal({
						title:'提示',
						content:'需完成登录授权后方能评论',
						success: (res) => {
							uni.switchTab({
								url:'/pages/my/my'
							})
						}
					})
				}
			},
			getMoreList(){
				let page = 1
				if(this.plList.length>0){
					page = Math.floor((this.plList.length/15)+1)
				}
				this.page = page
				this.getPlList()
			},
			getMore(item){
				let page = 1
				this.loading_c = true
				if(item.children&&item.children.length>0){
					page = Math.floor((item.children.length/15)+1)
				}
				pl.getList({identification:this.id,type:9,page,pid:item.id}).then(res=>{
					if(page == 1){
						item.children = res.data.data
					}else{
						item.children = item.children.concat(res.data.data) 
					}
					let index = this.plList.findIndex(item1=>(item.pid!=0?item.pid:item.id) == item1.id)
					this.plList[index] = item
					this.loading_c = false
				})
			},
			toSubmit(item){
				let data = {
					desc:item.desc1,
					identification:this.data.id,
					type:9,
					name:this.data.title,
				}
				if(item.id){
					data.pid = item.pid!=0?item.pid:item.id
					data.o_user_id = item.user_id
				}
				pl.CommentAdd(data).then(res=>{
					if(res.status==1){
						uni.showToast({
							title:'评论成功'
						})
						let info = JSON.parse(uni.getStorageSync('userinfo'))
						if(item.id){
							let data = {
								avatar:info.avatar,
								nickname:info.nickname,
								o_nickname:item.nickname,
								desc:item.desc1,
								createtime:'刚刚'
							}
							let index = this.plList.findIndex(item1=>(item.pid!=0?item.pid:item.id) == item1.id)
							this.plList[index].comment_num+=1
							if(this.plList[index].children&&this.plList[index].children.length>0){
								this.plList[index].children.push(data)
							}else{
								this.plList[index].children=[data]
							}
							this.plList.push('')
							this.plList.pop()
						}else{
							let data = {
								avatar:info.avatar,
								nickname:info.nickname,
								desc:item.desc1,
								createtime:'刚刚'
							}
							this.plList.unshift(data)
						}
					}else{
						uni.showToast({
							title:res.msg,
							icon:'none'
						})
					}
				}).catch(err=>{
					uni.showToast({
						title:err,
						icon:'none'
					})
				})
			},
			
			
			changeSc(){
				if(! JSON.parse(uni.getStorageSync('userinfo')).nickname ){
					uni.showModal({
						title:'提示',
						content:'需完成登录授权后方能收藏',
						success: (res) => {
							uni.navigateTo({
								url:'/pages/my/my'
							})
						},
					})
					return
				}
				gz.AttendAddOrCancel({identification:this.data.id,type:9,name:this.data.title}).then(res=>{
					if(res.status==1){
						this.isSc=!this.isSc
					}
				})
			},
		}
	}
</script>

<style  lang="scss" scoped>
.btn-special1{
	margin-bottom: 0 !important;
}
	.chain_n{
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 8px;
		view{
			padding: 2px 8px;
			background-color: #ff9933;
			color: #fff;
			border-radius: 4px;
			font-size: 12px;
			margin-right: 5px;
			margin-bottom: 5px;
		}
	}
	.h80{
		height: 80px;
	}
	.page{
		position: relative;
	}
	.page1{
		padding:  0 18px;
		width: calc(100% - 36px);
		overflow-x: hidden;
	}
	.zb{
		position: absolute;
		top: 0;
		right: 0;
		width: 100px;
		background: rgba($color: #000000, $alpha: .5);
		height: 26px;
		display: flex;
		align-items: center;
		padding: 0 8px;
		font-size: 14px;
		color: #fff;
		image{
			width: 18px;
			margin: 0 8px;
		}
		.dian{
			height: 10px;
			width: 10px;
			border-radius: 5px;
		}
		.red{
			background: red;
		}
	}
	.ss{
		width: 100%;
		margin-bottom: 5px;
	}
.m10{
	margin: 10px 0;
}
.bm{
	padding: 10px 10px;
}
.title_shu{
	position: relative;
	padding-left: 8px;
	font-size: 14px;
	color: #333;
	height: 16px;
	line-height: 16px;
	&::after{
		position: absolute;
		content: ' ';
		height: 14px;
		width: 3px;
		border-radius: 1px;
		background: #f93;
		left: 0;
		top: 1px;
	}
}
.bm_flex{
	display: flex;
	overflow-y: auto;
	padding: 14px 0 ;
	border-bottom: 1px solid #e6e6e6;
	position: relative;
	.img{
		width: 42px;
		height: 42px;
		border-radius: 21px;
		margin-right: 12px;
		// background: ;
		position: relative;
		image{
			width: 100%;
			height: 100%;
			border-radius: 21px;
		}
	}
	
}
	.qd::after{
		position: absolute;
		content:' ';
		background: url(https://wqq103910.oss-cn-hangzhou.aliyuncs.com/images/4/2020/09/qiandao.png) no-repeat;
		width: 22px;
		height: 22px;
		background-size: 100% 100%;
		top: -4px;
		right: -4px;
	}
.swiper{
	width: 100%;
	height: 200px;
	position: relative;
	.swiper_item{
		width: 100%;
		height:100%;
		image{
			width: 100%;
			height:100%;
		}
	}
}
.title_h{
	font-size: 24px;
	// font-weight: 800;
	margin: 0 14px;
	color: #000;
	padding: 10px 0;
	border-bottom: 1px solid #E5E5E5;
	margin-bottom: 20px;
	.small{
		display: flex;
		justify-content: space-between;
		font-size: 12px;
		color: #666;
		margin: 40px 0 8px;
	}
}
.heng{
	width: 100%;
	height: 8px;
	background-color: #dfdfdf;
}
.main{
	font-size: 13px;
	color: #666;
	padding: 10px 14px;
	.red{
		font-size: 16px;
		color: #f52e2e;
	}
	.m_item{
		display: flex;
		align-items: center;
		margin: 0px 0 10px;
	}
	image{
		width: 14px;
		height: 14px;
		margin-right: 5px;
	}
}
.bottom{
	position: fixed;
	justify-content: space-around;
	align-items: center;
	bottom: 0;
	width: calc(100% - 20px);
	padding: 0 10px;
	height: 66px;
	background: #FFFFFF;
	display: flex;
	z-index: 100;
	box-shadow: 0px -2px 2px #e7e7e7;
	.btn{
		font-size: 14px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #666;
		height: 32px;
		display: flex;
		justify-content: center;
		align-items: center;
		// background: linear-gradient(90deg, #FE8E33 0%, #FC5517 100%);
		background-color: #eae9ee;
		border-radius: 23px;
		width: 225px;
		image{
			width: 16px;
			height: 16px;
			margin-right: 10px;
		}
	}
	.sc{
		font-size: 12px;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #666666;
		text-align: center;	
		position: relative;
		image{
			width: 19px;
			height: 19px;
		}
		.num{
			position: absolute;
			font-size: 12px;
			background-color: red;
			height: 14px;
			line-height: 14px;
			border-radius: 7px;
			padding: 0 4px;
			color: #fff;
			right: -5px;
			top: -5px;
		}
	}
}
.pl_item{
	display: flex;
	margin: 10px 16px;
	width: calc(100% - 32px);
	.tx{
		width: 24px;
		height: 24px;
		margin-right: 10px;
	}
	.r{
		width: calc(100% - 34px);
		padding-bottom:10px;
		border-bottom: 1px solid #E9EBEE;
		.top{
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-bottom: 10px;
			.name{
				font-size: 14px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #507DAF;
			}
			.time{
				font-size: 14px;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #999999;
			}
		}
		.content{
			max-width: 100%;
			min-width: 100%;
			padding-top:10px;
			font-size: 16px;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
		}
	}
}
.fj_title{
	color: #ff9933;
	font-size: 15px;
	margin: 10px 0 6px;
}
.fj_item{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 6px;
	.fj_name{
		width: 100%;
		font-size: 13px;
		color: #006bde;
	}
}

</style>
